<html>
    <head>
        <title>解析模板时的注意事项</title>
    </head>
    <body>
        <script>
            // 九、解析DOM模板时的注意事项
                            /*
                                 有些HTML元素，诸如 <ul>、<ol>、<table> 和 <select>,对于哪些元素可以出现在其内部是由严格限制的。
                                
                                 而有些元素， 诸如 <li> 、<tr> 和 <option> 只能出现在其他某些特定的元素内部。
                            */

                            // 这会导致我们使用这些有约束条件的元素时遇到一些问题：
                                    /*
                                        <table>
                                            <blog-post-row></blog-post-row>
                                        </table>
                                    */

                            /*
                                 这个自定义组件<blog-post-row>会被作为无效的内容提升到外部，并导致最终渲染结果出错。
                                        
                                 幸好，这个特殊的 is 组件属性给了我们一个变通途的方法：
                            */
                                    /*
                                        <table>
                                            <tr is="blog-post-row"></tr>
                                        </table>
                                    */

                              /*
                                  需要注意的是如果我们从以下来源使用模板的话，这条限制是不存在的：

                                        1、字符串（例如： template:'......'）
                                        2、单文本组件 (.vue)
                                        3、<script type="text/x-template">
                              */
        </script>
    </body>
</html>